.dux-index-header {
  background: url("../images/user-bg.jpg");
  a {
    color: #fff;
  }
  .header-user {
    color: #fff;
    padding: 20px 10px;
    display: flex;
    .user-avatar {
      width: 80px;
      img {
        width: 64px;
        height: 64px;
        border: 2px solid rgba(255,255,255,.8);
        border-radius: 50%;
      }
    }
    .user-info {
      flex: 1;
      .username {
        font-size:1.8rem;
      }
      .info {
        padding-top: 10px;
        a {
          color: rgba(255,255,255, .9);
          margin-right: 10px;
          font-size:1.2rem;
          padding: 2px 5px;
          border: 1px solid rgba(255,255,255, .8);
        }
      }
    }
    .user-tip {
      width: 50px;
      padding-top: 5px;
    }
  }
  .header-info {
    li {
      padding: 2px;
      padding-bottom: 0;
      text-align: center;
      font-size:1.2rem;
      a {
        padding: 5px 0;
        background-color: rgba(0,0,0, .1);
        display: block;
        span {
          display: block;
        }
        .num {
          font-size:1.4rem;
        }
      }
    }
  }
}

.dux-index-icon {
  text-align: center;
  font-size:1.2rem;
  i {
    font-size:2rem;
    width: 30px;
    height: 30px;
    &:before {
      width: 30px;
      height: 30px;
      line-height:30px;
      text-align: center;
    }
  }
  a {
    display: block;
    padding: 10px 0;
    position: relative;
    .am-badge {
      border-radius: 10px;
      position: absolute;
      top:5px;
      margin-left: 5px;
    }
  }
}